<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <link rel="stylesheet" href="./style/main/banner.css">
    <link rel="stylesheet" href="./style/main/public.css">
    <link rel="stylesheet" href="./style/main/header.css">
    <link rel="stylesheet" href="./style/main/bigabs.css">
    <link rel="stylesheet" href="./style/main/ads.css">
    <link rel="stylesheet" href="./style/main/stairs.css">
    <link rel="stylesheet" href="./style/shopcarts/shopcarts.css">
    <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>
    <script src="https://cdn.bootcss.com/jquery-cookie/1.4.1/jquery.cookie.min.js"></script>

</head>

<body>
    <div class="header">
        <div class="header-top">
            <div class="header-top-box">
                <ul class="header-top-left fl">
                    <li class="header-top-left-first">Welcome to JuMei!</li>

                    <li class="header-top-left-second fl"><a href="./login.html">登录</a></li>
                    <li class="header-top-left-third fl"><a href="./login.html?le=1">注册</a></li>
                    <li class="header-top-left-forth fl" style="display: none"></li>
                    <li class="header-top-left-fifth fl" style="display: none">注销</li>
                    <li class="header-top-left-sixty fl" style="display: none">修改密码</li>




                </ul>
                <ul class="header-top-right fr">
                    <li><a href="#">正品保证</a></li>
                    <li><a href="#">订单查询</a></li>
                    <li class="my-collect"><a href="#">收藏的品牌</a><s></s></li>
                    <li class="my-jumei"><a href="#"><s class="icon_arrow_down"></s>我的聚美</a>
                        <div class="my-list jumei-list unactive">
                            <ul>
                                <li><a href="#">我的订单</a></li>
                                <li><a href="#">我的现金券</a></li>
                                <li><a href="#">我的红包</a></li>
                                <li><a href="#">我的余额</a></li>
                                <li><a href="#">我的提款</a></li>
                                <li><a href="#">我的收藏</a></li>
                                <li><a href="#">我的心愿</a></li>
                                <li><a href="#">会员中心</a></li>
                                <li><a href="#">礼品卡兑换</a></li>


                            </ul>
                        </div>
                    </li>
                    <li><span class="line"></span> <a href="#">手机聚美</a></li>
                    <li class="more"><span class="line"></span> <a href="#">更多<s class="icon_arrow_down"></s></a>
                        <div class="my-list more-list unactive">
                            <ul>
                                <li><a href="#">邀请好友</a></li>
                                <li><a href="#">加入收藏</a></li>
                                <li><a href="#">新浪微博</a></li>
                                <li><a href="#">聚美微信</a></li>
                                <li><a href="#">百度贴吧</a></li>

                            </ul>
                        </div>
                    </li>
                </ul>
            </div>
        </div>
        <div class="header-center">
            <div class="logo fl">
                <a href="#"></a>
            </div>
            <div class="header-center-second fl">
                <div><input type="text" class='header-center-inp-text'>
                    <input type="button" class="header-center-inp-btn" value="搜索">
                </div>

                <ul class="header-center-recommend clear">
                    <li><a href="#">保湿</a><s class="line"></s></li>
                    <li><a href="#">保湿</a><s class="line"></s></li>
                    <li><a href="#">保湿</a><s class="line"></s></li>
                    <li><a href="#">保湿</a><s class="line"></s></li>
                    <li><a href="#">保湿</a><s class="line"></s></li>
                </ul>
            </div>
            <div class="header-center-carts fr">
                <a class="center-carts fr" href="#">
                    <div class="cart-img fl"><img src="http://p0.jmstatic.com/assets/cart.gif" alt=""></div>
                    <div class="carts-text fl">去购物车结算 <s class="icon_arrow_right"></s></div>
                </a>
                <div class="carts-contents unactive">
                    <div class="carts-tips">
                        购物车还没有商品<br>
                        请添加商品吧！
                    </div>
                </div>
            </div>
        </div>
        <div class="header-bottom">
            <div class="header-bottom-box">
                <ul class="header-bottom-nav fl">
                    <li class="home"><a href="#">首页</a></li>
                    <li><a href="#">急速免税店</a></li>
                    <li><a href="#">母婴特卖</a></li>
                    <li class="beauty-shop"><a href="#">美妆商城</a>
                        <div class="beauty-shop-list unactive">
                            <div class="beauty-shop-left fl">
                                <div>
                                    <a href="#"><img src="http://p0.jmstatic.com/banner/3481/30573_254_135_003-web.jpg"
                                            alt=""></a>
                                </div>
                                <div>
                                    <a href="#"><img src="http://p0.jmstatic.com/banner/3481/30573_254_135_005-web.jpg"
                                            alt=""></a>
                                </div>
                            </div>
                            <div class="beauty-shop-right fl">
                            </div>
                        </div>
                    </li>
                    <li><a href="#">国际轻奢</a></li>
                    <li><a href="#">运动服装</a></li>
                    <li><a href="#">鞋包配饰</a></li>
                </ul>
            </div>
        </div>
    </div>

    <div class="banner">
        <div class='go1'>
            <div class="lt"> 前一夜</div>
        </div>
        <div class='go2'>
            <div class="gt">后一夜</div>
        </div>

        <div class="long-banner">
            <!-- <div style="width: 400%"></div> -->
            <a href="javascript:void(0)" class="long-banner-first long-banner1 fl"></a>
            <a href="javascript:void(0)" class="long-banner-first long-banner2 fl"></a>
            <a href="javascript:void(0)" class="long-banner-first long-banner3 fl"></a>
        </div>
    </div>
    <!-- banner end -->
    <!-- content start -->
    <div class="big-ads" id="big-ads">
        <ul class="big-ads-top">
            <li class="abs-now">今日疯抢</li>
            <li class="">明日预定</li>
        </ul>
        <div class="big-ads-content">
            <a href="#" class="big-ads-pic">
                <img src="http://p0.jmstatic.com//jmstore/image/000/006/6797_std/5d3158a888522_535_212.jpg?1563525784"
                    alt="">
            </a>
            <a href="#" class="big-ads-pic">
                <img src="http://p0.jmstatic.com//jmstore/image/000/006/6797_std/5d3158a888522_535_212.jpg?1563525784"
                    alt="">
            </a> <a href="#" class="big-ads-pic">
                <img src="http://p0.jmstatic.com//jmstore/image/000/006/6797_std/5d3158a888522_535_212.jpg?1563525784"
                    alt="">
            </a> <a href="#" class="big-ads-pic">
                <img src="http://p0.jmstatic.com//jmstore/image/000/006/6797_std/5d3158a888522_535_212.jpg?1563525784"
                    alt="">
            </a> <a href="#" class="big-ads-pic">
                <img src="http://p0.jmstatic.com//jmstore/image/000/006/6797_std/5d3158a888522_535_212.jpg?1563525784"
                    alt="">
            </a> <a href="#" class="big-ads-pic">
                <img src="http://p0.jmstatic.com//jmstore/image/000/006/6797_std/5d3158a888522_535_212.jpg?1563525784"
                    alt="">
            </a> <a href="#" class="big-ads-pic">
                <img src="http://p0.jmstatic.com//jmstore/image/000/006/6797_std/5d3158a888522_535_212.jpg?1563525784"
                    alt="">
            </a> <a href="#" class="big-ads-pic">
                <img src="http://p0.jmstatic.com//jmstore/image/000/006/6797_std/5d3158a888522_535_212.jpg?1563525784"
                    alt="">
            </a> <a href="#" class="big-ads-pic">
                <img src="http://p0.jmstatic.com//jmstore/image/000/006/6797_std/5d3158a888522_535_212.jpg?1563525784"
                    alt="">
            </a> <a href="#" class="big-ads-pic">
                <img src="http://p0.jmstatic.com//jmstore/image/000/006/6797_std/5d3158a888522_535_212.jpg?1563525784"
                    alt="">
            </a> <a href="#" class="big-ads-pic">
                <img src="http://p0.jmstatic.com//jmstore/image/000/006/6797_std/5d3158a888522_535_212.jpg?1563525784"
                    alt="">
            </a>
        </div>
    </div>
    <!-- big-ads end -->
    <!-- ads start -->
    <div class="ads" id="ads">
        <h2 class="ads-top"></h2>
        <div class="newitem-lays">
            <div>每日十点上新</div>
        </div>
        <div class="ads-item">
            <!-- <li><a href="#"><img src="http://p1.jmstatic.com/product/004/898/4898166_std/4898166_dx_1000_400.jpg"
                        alt="">
                    <p class="title unactive">新品上线，快来试试吧</p>
                </a>
                <div class="bottom">
                    <span class="title1">【6款任选】正版授权宝可梦皮卡丘儿童拼插积木摆件</span>
                    <span class="price">$33</span>
                </div>

            </li> -->



        </div>
    </div>
    <!-- 左侧窗口 -->
    <div class="stairs" style="visibility: hidden">
        <li class="stairs-first">聚美<br>优品</li>
        <li class="stairs-second">
            <a href="#big-ads" class="stair1">
                <p>今日推荐</p>
            </a>
        </li>
        <li class="stairs-third">
            <a href="#ads" class="stair2">
                <p>今日新上</p>
            </a>
        </li>
    </div>
    <!-- 购物车开始 -->
    <div class="shopcarts">
        <div class="shopcarts-main">
            <div class="carts-first">
                <s></s>
            </div>
            <div class="big-item">
                <div class="big-item-first"></div>
            </div>
            <div class="carts-second">
                <s></s>
            </div>
        </div>

    </div>
    <!-- 购物车结束 -->
    <script type="module" src="./javascript/dynamic.js"></script>
    <script type="module" src="./javascript/index.js"></script>

</body>

</html>